<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>css.html</title>
	
    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
    <meta http-equiv="description" content="this is my page">
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    
    <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
	
	<style type="text/css">
		div{
			color:red;
		}
		#myspan{
			color:grenn;
		}

		.k{
			color:yellow;
		}
		p[l="ajax"]{
			color:blue;
		}
		p:nth-child(odd){
			color:red;
		}
		p:nth-child(even){
			color:yellow;
		}
		a{
			text-decoration:none;
		}
		a:hover{
			color:red;
		}
	</style>
	<script type="text/javascript">
		function loadReady(){
			var myname=document.getElementById("myname");
			alert(myname);
			var mysex=document.getElementsByName("sex")[0];
			alert(mysex);
			var myage=document.getElementsByTagName("input")[2];
			alert(myage);
			//删除子元素(removeChile)，追加(appendChild)
			document.getElementsByTagName("form")[0].removeChild(myname);
			
			var myinput =document.createElement("input");
			document.getElementById("mydiv").appendChild(myinput);
		
		}
		
	</script>
  </head>
  <!-- onload 加载完后调用 -->
  <body onload="loadReady()">
    <div> hello</div>
    <span id="myspan">css</span>
    <p class="k">jquery</p>
    <p l="ajax">ajax</p>
    <a href="https://www.baidu.com">百度</a>
    
    <form >
    用户名:<input type="text" id="myname">
   性别:<input type="text" name="sex">
   年龄:<input type="text">
    </form>
    <div id="mydiv" style="border:1px solid black;width:100px;height:100px"></div>
  </body>
</html>
